<!-- 模板继承 -->
{extend name="public:base" /}

<!-- 页面标题 -->
{block name="title"}Administrator{/block}

<!-- 自定义css -->
{block name="css"}{/block}

<!-- 内容区域 -->
{block name="content"}
  <div class="nav-tabs-custom">
    <ul class="nav nav-tabs">
      <li class=""><a href="{:url('admin/document/index')}">{:lang('Document')}</a></li>
      <li class=""><a href="{:url('admin/document/create')}">{:lang('Create')}</a></li>
      <li class="pull-right"><a href="javascript:history.back(-1);" class="text-muted"><i class="fa fa-chevron-circle-left"></i></a></li>
    </ul>
    <div class="tab-content">
      <div class="tab-pane active">
        <form role="form" id="operate">
            <div class="row">
                <div class="col-md-8">
                    <div class="box box-solid">
                        <div class="box-body">
                            <div class="form-group">
                              <label>{:lang('Title')} <span class="text-red">*</span></label>
                              <div class="row">
                              <div class="col-md-12">
                              <input type="hidden" name="id" value="{$info.id}">
                              <input type="text" name="title" value="{$info.title}" class="form-control input-sm" placeholder="">
                              </div>
                              </div>
                            </div>
                            <div class="form-group">
                              <label>{:lang('Option')} <span class="text-red">*</span></label>
                              <div class="row">
                              <div class="col-md-12">
                                <label class="checkbox-inline">
                                  <input type="checkbox" {eq name="info.image_flag" value="1"}checked{/eq} name="image_flag" value="1"> {:lang('Image')}
                                </label>
                                <label class="checkbox-inline">
                                  <input type="checkbox" name="video_flag" {eq name="info.video_flag" value="1"}checked{/eq} value="1"> {:lang('Video')}
                                </label>
                                <label class="checkbox-inline">
                                  <input type="checkbox" name="attach_flag" {eq name="info.attach_flag" value="1"}checked{/eq} value="1"> {:lang('Attach')}
                                </label>
                                <label class="checkbox-inline">
                                  <input type="checkbox" name="hot_flag" {eq name="info.hot_flag" value="1"}checked{/eq} value="1"> {:lang('Hot')}
                                </label>
                                <label class="checkbox-inline">
                                  <input type="checkbox" name="recommend_flag" {eq name="info.recommend_flag" value="1"}checked{/eq} value="1"> {:lang('Recommend')}
                                </label>
                                <label class="checkbox-inline">
                                  <input type="checkbox" name="focus_flag" {eq name="info.focus_flag" value="1"}checked{/eq} value="1"> {:lang('Focus')}
                                </label>
                                <label class="checkbox-inline">
                                  <input type="checkbox" name="top_flag" {eq name="info.top_flag" value="1"}checked{/eq} value="1"> {:lang('Top')}
                                </label>
                              </div>
                              </div>
                            </div>
                            <div class="form-group">
                              <label>{:lang('Content')}</label>
                              <div class="row">
                              <div class="col-md-12">
                              <textarea id="editor" name="content">{$info.content}</textarea>
                              </div>
                              </div>
                            </div>
                            <div class="" id="extra">

                            </div>
                        </div>
                        <!-- /.box-body -->
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="box box-solid">
                        <div class="box-body">
                            <div class="form-group">
                              <label>{:lang('Category')} <span class="text-red">*</span></label>
                              <div class="row">
                              <div class="col-md-12">
                              <select name="cid" class="form-control">
                                <option>--{:lang('Select')}--</option>
                                <option value="0">--{:lang('Not specified')}--</option>
                                {volist name="category" id="vo"}
                                <option {eq name="info.cid" value="$vo.id"}selected{/eq} value="{$vo.id}">
                                    {eq name="vo.pid" value="0"}
                                        {$vo.title}
                                    {else/}
                                        {$vo.html} {$vo.title}
                                    {/eq}
                                </option>
                                {/volist}
                              </select>
                              </div>
                              </div>
                            </div>
                            <div class="form-group">
                              <label>{:lang('Image')}</label>
                              <div class="row">
                              <div class="col-md-12">
                                <div class="layui-upload-drag" id="image">
                                  <input type="hidden" name="image" value="{$info.image}">
                                  <div class="layui-upload-list" id="preview">
                                  {empty name="info.image"}
                                  <p>{:lang('Upload')}</p>
                                  {else /}
                                  <img class="layui-upload-img img-responsive" src="{$info.image}" />
                                  {/empty}
                                  </div>
                                </div>
                              </div>
                              </div>
                            </div>
                        </div>
                        <!-- /.box-body -->
                    </div>
                    <div class="box box-solid">
                        <div class="box-body">
                            <div class="form-group">
                              <label>{:lang('Keywords')}</label>
                              <div class="row">
                              <div class="col-md-12">
                              <input type="text" name="keywords" value="{$info.keywords}" class="form-control input-sm" placeholder="">
                              </div>
                              </div>
                            </div>
                            <div class="form-group">
                              <label>{:lang('Description')}</label>
                              <div class="row">
                              <div class="col-md-12">
                              <textarea class="form-control input-sm" name="description" rows="3" placeholder="">{$info.description}</textarea>
                              </div>
                              </div>
                            </div>
                            <div class="form-group">
                              <label>{:lang('Reading limit')}</label>
                              <div class="row">
                              <div class="col-md-12">
                              <select name="role_id" class="form-control">
                                <option value="0">游客</option>
                                {volist name="role" id="vo"}
                                <option {eq name="info.role_id" value="$vo.role_id"}selected{/eq} value="{$vo.role_id}">{$vo.role_name}</option>
                                {/volist}
                              </select>
                              </div>
                              </div>
                            </div>
                            <div class="form-group">
                              <label>{:lang('Price')}</label>
                              <div class="row">
                              <div class="col-md-12">
                              <input type="text" name="price" value="{$info.price}" class="form-control input-sm" placeholder="0.00">
                              </div>
                              </div>
                            </div>
                            <div class="form-group">
                              <label>{:lang('Creation date')}</label>
                              <div class="row">
                              <div class="col-md-12">
                                {$info.create_at}
                              </div>
                              </div>
                            </div>
                        </div>
                        <!-- /.box-body -->
                    </div>
                </div>
            </div>
        </form>
      </div>
      <!-- /.tab-pane -->
    </div>
    <!-- /.tab-content -->
    <div class="box-footer">
        <div class="btn-group">
            <button class="btn btn-primary btn-flat" onclick="operate();" type="button"> {:lang('Save')}</button>
        </div>
    </div>
  </div>
{/block}

<!-- 自定义js -->
{block name="js"}
<script>
layui.use('upload', function(){
  var $ = layui.jquery
  ,upload = layui.upload;
  //拖拽上传
  upload.render({
    elem: "#image"
    ,accept: 'file'
    ,multiple: false
    ,number: 1
    ,url: "{:url('admin/upload/uploadFile')}"
    ,done: function(res){
      if (res.code == 200) {
        $("[name='image']").val(res.data.url);
        $("#preview").html("<img class=\'layui-upload-img img-responsive\' src=\'"+res.data.url+"\'>");
      } else {
        swal({
          position: 'center',
          type: 'error',
          title: res.msg,
          showConfirmButton: false,
          toast:false,
          timer: 2000
        });
      }
    }
  });
  
});
</script>

<script src="__STATIC__/ueditor/ueditor.config.js"></script>
<script src="__STATIC__/ueditor/ueditor.all.min.js"></script>
<script type="text/javascript">
var ue = UE.getEditor('editor', {
    toolbars: [
        ['fullscreen', 'source', 'undo', 'redo', 'selectall', '|', 'removeformat', 'formatmatch', 'autotypeset', 'cleardoc', '|', 'template', 'indent', 'horizontal','justifyleft', 'justifyright', 'justifycenter', 'justifyjustify', 'insertcode'],
        ['fontfamily', 'fontsize', '|', 'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'link', 'unlink', 'inserttable', 'deletetable', 'simpleupload', 'insertimage']
    ],
    initialFrameWidth: '100%',
    initialFrameHeight:300,
    scaleEnabled:true,
    serverUrl: '{:url("admin/ueditor/index")}',
});
</script>
<script type="text/javascript">
    (function(){
        var obj = $("[name='cid']");
        // 默认选中的值
        var cid = obj.find(":selected").val();
        if (cid) {
            createInput(cid)
        }

        // change事件的值
        obj.change(function(){
            createInput(obj.val())
        })

        // ajax请求
        function createInput(cid) {
            $.ajax({
                url:"{:url('admin/document/createInput')}",
                data:{'cid':cid,'extra':{$info.id}},
                type:'post',
                dataType:'json',
                success:function(xhr){
                    $("#extra").html(xhr);
                }
            });
        }
    }())

    function operate(){
        $.ajax({
            url:"{:url('admin/document/edit')}",
            data:$("#operate").serialize(),
            type:'post',
            dataType:'json',
            success:function(xhr){
                if(xhr.code == 200){
                    swal({
                      position: 'center',
                      type: 'success',
                      title: xhr.msg,
                      showConfirmButton: false,
                      toast:false,
                      timer: 2000
                    });
                } else{
                    swal({
                      position: 'center',
                      type: 'error',
                      title: xhr.msg,
                      showConfirmButton: false,
                      toast:false,
                      timer: 2000
                    });
                }
            }
        });
    }
</script>
{/block}